<!DOCTYPE html>
<style>
body {
    margin: 0;
    padding: 0;
}
table {
    padding: 0;
    border: 0;
    border-spacing: 0;
    display: inline-table;
}
span {
   font: 50px Ahem;
   line-height: 80px;
}
td {
    border: 0px;
    padding: 10px;
    height: 20px;
    vertical-align: baseline;
}

#content {
    height: 5px;
}
</style>
<script src="../../resources/check-layout.js"></script>
<span data-total-y=15>
    Text
    <table data-total-y=40>
        <tr><td><div id="content"></div></td></tr>
    </table>
    Text
</span>
<p>crbug.com/452593: If an inline-table consists of a single row which consists of a cell whose styled height exceeds the styled
   height of its contents then the table should use the bottom of the table as its baseline. 
   </p>
   <p id="test-output"></p>
<script>
checkLayout('span', document.getElementById("test-output"));
checkLayout('table', document.getElementById("test-output"));
</script>
